<template>
	<view class="page-content">
		<view class="flex-start" style="align-items: center;margin-bottom: 15px;padding:0 12px;padding-top: 12px;">
			<view class="inputLabel">钓场：</view>
			<view class="uni-input-wrapper flex-start"
				style="flex: 1;align-items: center;padding: 0px 0px;border-radius: 7px;">
				<uni-data-select v-model="site" :disabled='true'  :localdata="typeOptions" @change="typeChange"  :clear="false"></uni-data-select>
			</view>
		</view>
		
		<view class="flex-start" style="align-items: center;margin-bottom: 15px;padding:0 12px;">
			<view class="inputLabel">场次：</view>
			<view class="uni-input-wrapper flex-start"
				style="flex: 1;align-items: center;padding: 0px 0px;border-radius: 7px;">
				<uni-data-select v-model="session" :localdata="typeOptions" @change="typeChange" :disabled='true' :clear="false"></uni-data-select>
			</view>
		</view>
		
		<view class="list-box">
			<view class="flex-start" style="background: #fff;margin-bottom: 10px;">
				<view class="gray-word">排名</view>
				<view class="gray-word">钓位</view>
				<view class="gray-word">鱼获</view>
			</view>
			<view class="red-line">
				
			</view>
			<view class="scroll-box">
				<view class="list-item flex-start" v-for="item in listData" :key="item.id">
				<view class="flex-1">
					{{item.order}}
				</view>
				<view class="flex-1 red-word">
					{{item.site}}
				</view>
				<view class="flex-1 red-word">
					{{item.fish}}
				</view>
			</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				couponName: '',
				balance: '',
				lowBalance: '',
				num: '',
				time: '',
				site:0,
				session:1,
				typeOptions: [{
						value: 0,
						text: "盛耀俱乐部"
					},
					{
						value: 1,
						text: "10000斤白天正钓"
					},
					{
						value: 2,
						text: "游泳"
					},
				],
				listData:[
					{order:1,site:13,fish:'412斤',id:1},
					{order:1,site:13,fish:'412斤',id:2},
					{order:1,site:13,fish:'412斤',id:3},
					{order:1,site:13,fish:'412斤',id:4},
					{order:1,site:13,fish:'412斤',id:5},
					{order:1,site:13,fish:'412斤',id:6},
					{order:1,site:13,fish:'412斤',id:7},
					{order:1,site:13,fish:'412斤',id:8},
					{order:1,site:13,fish:'412斤',id:9},
					{order:1,site:13,fish:'412斤',id:10},
					{order:1,site:13,fish:'412斤',id:7},
					{order:1,site:13,fish:'412斤',id:8},
					{order:1,site:13,fish:'412斤',id:9},
					{order:1,site:13,fish:'412斤',id:10},
					{order:1,site:13,fish:'412斤',id:7},
					{order:1,site:13,fish:'412斤',id:8},
					{order:1,site:13,fish:'412斤',id:9},
					{order:1,site:13,fish:'412斤',id:10},
					{order:1,site:13,fish:'412斤',id:7},
					{order:1,site:13,fish:'412斤',id:8},
					{order:1,site:13,fish:'412斤',id:9},
					{order:1,site:13,fish:'412斤',id:10},
					
				]
			}
		},
		methods: {
	
			typeChange(e) {
	
			},

		}
	}
</script>

<style lang="scss" scoped>
	.page-content {
		height: calc(100vh - 44px);
		background: #fff;
		padding: 0px;
	}
	.list-box{
		text-align: center;
		
	}
	.gray-word{
		color: #999;
		flex: 1;
	}
	.flex-1{
		flex:1;
	}
	.red-word{
		color: #D43030;
		font-weight: 600;
	}
	.red-line{
		border: 2px solid #D43030;
	}
	.list-item{
		border-bottom: 1px solid #E5E5E5;
		padding: 15px 0;
	}
	.scroll-box{
		height: calc(100vh - 196px);
		overflow: auto;
	}
</style>